<!--我的常用-->
<template>
	<div class="m-view-mine m-window" v-loading="detailsLoading">
		<el-card class="box-card-notice" v-loading="loading" v-if="noticeShow">
			<div slot="header" class="clearfix">
				<span style="font-size: 18px;flex:1">通知公告</span>
				<div>
					<i class="el-icon-refresh" @click="initData"></i>
					<el-button type="text" style="border: none;color:blue;" class="moreBtn" @click="showMore">更多></el-button>
				</div>
			</div>
			<table style="width: 100%;">
				<tr v-for="(item,index) in noticeDetails" :key="index">
					<td style="width: 1px;padding-left: 10px; font-size: 10px;">●</td>
					<td style="padding-left: 5px;padding-top: 1px;padding-right: 100px;">
						<button id="theValue" :class="['rendererClass',{'m-unreadPoint': item.hasRead == 0}]" @click="getClickValue(item)">{{item.title}}</button>
					</td>
					<td
						style="width: 80px;padding-right: 10px;"
					>{{new Date(item.releaseDate.replace(/\-/g, "/")).Format('yyyy-MM-dd')}}</td>
				</tr>
			</table>
		</el-card>
		<el-card class="box-card-flow" v-loading="flowloading" v-if="flowShow">
			<div slot="header" class="clearfix">
				<span style="font-size: 18px;flex:1">消息中心</span>
				<div>
					<i class="el-icon-refresh" @click="refreshFlowList"></i>
					<el-button
						type="text"
						style="border: none;color:blue;"
						class="moreBtn"
						@click="showMoreFlow"
					>更多></el-button>
				</div>
			</div>
			<el-tabs v-model="bActiveName" @tab-click="handleClick" type="card">
				<el-tab-pane :label="`${noFinishTitle}(${totalFlow.unread})`" name="noFinishFlow">
					<table style="width: 100%;">
						<tr v-for="(item,index) in noFinishflowDetails" :key="index">
							<td style="width: 1px;padding-right: 10px;font-size: 10px;">●</td>
							<td style="padding-right: 5px;padding-top: 1px;padding-right: 100px;">
								<button
									id="theValue"
									class="rendererClass"
									@click="getClickNoFinishFLowValue(item)"
								>{{item.content}}</button>
							</td>
							<td style="width: 200px;padding-right: 0px;">{{item.createDate}}</td>
						</tr>
					</table>
				</el-tab-pane>
				<el-tab-pane :label="`${finishTitle}(${totalFlow.read})`" name="FinishFlow">
					<table style="width: 100%;">
						<tr v-for="(item,index) in flowDetails" :key="index">
							<td style="width: 1px;padding-right: 10px;">●</td>
							<td style="padding-right: 5px;padding-top: 1px;padding-right: 100px;">
								<button
									id="theValue"
									class="rendererClass"
									@click="getClickNoFinishFLowValue(item)"
								>{{item.content}}</button>
							</td>
							<td style="width: 200px;padding-right: 0px;">{{item.createDate}}</td>
						</tr>
					</table>
				</el-tab-pane>
			</el-tabs>
		</el-card>

		<!-- 调用实物对账单组件 -->
		<div class="m-window" v-if="!isPhysicalShow">
			<physicalApplyComponents
				@cancelComponents="cancelComponents"
				:pageLayOut="pageLayOut"
				:setClickValue="setClickValue"
			></physicalApplyComponents>
		</div>

		<!-- 调用会计对账单组件 -->
		<div class="m-window" v-if="!isAccountShow">
			<accountApplyComponents
				@cancelComponents="cancelComponents"
				:pageLayOut="pageLayOut"
				:setClickValue="setClickValue"
			></accountApplyComponents>
		</div>
		<!-- 调用会计对账单审核组件 -->
		<div class="m-window" v-if="!isAccountAudit">
			<accountAuditComponents
				@cancelComponents="cancelComponents"
				:pageLayOut="pageLayOut"
				:setClickValue="setClickValue"
			></accountAuditComponents>
		</div>
		<!-- 调用订单组件 -->
		<div class="m-window" v-if="!isPurOrdShow">
			<purOrderDetailsComponents
				@cancelComponents="cancelComponents"
				:ordStatus="ordStatus"
				:getClickValue="setClickValue"
			></purOrderDetailsComponents>
		</div>

		<!-- <noticeDetailsComponent v-if="!noticeShow" :setClickValue="clickValue" @cancelComponents="cancelComponents"></noticeDetailsComponent> -->
		<noticeDetailsComponent
			v-if="!noticeShowMx"
			:setClickValue="clickValue"
			@cancelComponents="cancelComponents"
		></noticeDetailsComponent>
	</div>
</template>

<style lang="less">
.m-view-mine {
	.box-card-flow {
		.item {
			margin-top: 10px;
			margin-right: 40px;
		}
	}
}

.box-card-flow {
	.el-tabs__content {
		overflow: auto;
	}
}
</style>


<script>
import _Api from "@/api";
import noticeDetailsComponent from "@/views/mine/noticeDetailsComponent.vue"
import physicalApplyComponents from "@/views/accountManagement/physicalApplyComponents.vue"
import accountApplyComponents from "@/views/accountManagement/accountApplyComponents.vue"
import accountAuditComponents from "@/views/accountManagement/accountAuditComponents"
import purOrderDetailsComponents from "@/views/purchase/purOrderDetailsComponents.vue"
import constant from "@/public/constant";
import Msg from "@/public/message"

export default {
	data () {
		return {
			noticeDetails: [],
			flowDetails: [],
			noFinishflowDetails: [],
			activeName: "first",
			pageLayOut: 'edit',
			loading: true,
			flowloading: true,
			tabLoading: true,
			noticeShow: true,
			noticeShowMx: true,
			isPhysicalShow: true,
			isAccountShow: true,
			isPurOrdShow: true,
			clickValue: {},
			setClickValue: {},
			clickPhysicalValue: {},
			clickAccountValue: {},
			flowShow: true,
			noFinishTitle: '未读',
			finishTitle: '已读',
			bActiveName: 'noFinishFlow',
			orderInfo: {},
			ordStatus: '',
			// 流程消息总条数   
			totalFlow: {
				unread: 0,
				read: 0
			},
			//  明细加载
			detailsLoading: false,
			//   会计对账审核页显示
			isAccountAudit: true
		};
	},
	created () {
	},
	methods: {
		initData () {
			var obj = {
				size: 10,
				current: 1,
				orderBy: ["releaseDate"],
				eqParams: { "state": 1 }
			};
			this.userType = constant.accountType
			if (constant.accountType === "4")
				obj.inParams = { "traType": [0, 2] }
			else
				obj.inParams = { "traType": [1, 2] }
			var that = this;
			_Api.getNoticeInfo(obj).then(function (response) {
				that.loading = false;
				var data = response.data;
				if (data.code == "1") {
					if (data.total > 0) {
						that.noticeDetails = data.rows.splice(0);
					}
				}
			}).catch(() => {
				that.loading = false;
			})
		},
		// 点击流程获取单据主表信息
		getClickNoFinishFLowValue (params) {
			var that = this;
			// 点击流程后更新流程状态
			if (this.bActiveName == 'noFinishFlow') {
				this.updateFlowState(params.id);
			}
			let orderNo = JSON.parse(params.param);
			that.getListById(orderNo.targetId, orderNo.targetNo)
		},

		getFinishedFLowValue (params) {
			var that = this;
			this.noticeShow = false;
			this.flowShow = false;
			// this.isPhysicalShow = false;
			this.setClickValue = params;
			//判断ordStatus值
			this.setClickValue.id = this.setClickValue.orderId;
			if (constant.accountType == "1") {
				if (params.billState == 1) {
					this.ordStatus = 4
				} else {
					this.ordStatus = 1
				}
			} else if (constant.accountType == "4") {
				if (params.billState == 1) {
					that.ordStatus = 4
				} else if (params.billState == 2) {
					that.ordStatus = 3
				}
			}
		},
		setHasRead(params){
			_Api.setHasRead(params);
		},
		getClickValue (params) {
			// 公告未读则点击公告的时候设置公告已读，公告已读则不再设置
			if(params.hasRead != 1) {
				params.hasRead = 1;
				this.setHasRead({
					id: params.ID,
					userName: constant.userName
				});
			}
			this.clickValue = params;
			this.noticeShow = false;
			this.noticeShowMx = false;
			this.flowShow = false;
		},

		cancelComponents (msg) {
			if (msg) {
				// this.noticeShow = true;
				this.noticeShowMx = true;
				this.noticeShow = true;
				this.flowShow = true;
				this.isPhysicalShow = true;
				this.isAccountShow = true;
				this.isPurOrdShow = true;
				this.isAccountAudit = true
				this.initData();
				this.getNoFinishFlowInfo();
				this.getFinishedFlowInfo();
			}
		},
		//更多通知公告
		showMore () {
			var editableTabs = this.$parent.$parent.$parent.editableTabs;
			var flag = false;
			if (editableTabs.length > 0) {
				for (var i in editableTabs) {
					if (editableTabs[i].content == "noticeList2") {
						flag = true;
						break;
					}
				}
				if (flag) {
					this.$parent.$parent.$parent.editableTabsValue = "noticeList2"
				}
				else {
					this.$parent.$parent.$parent.editableTabs.push({
						name: "noticeList2",
						title: "公告列表",
						content: "noticeList2"
					})
					this.$parent.$parent.$parent.editableTabsValue = "noticeList2"
				}
			} else {
				this.$parent.$parent.$parent.editableTabs.push({
					name: "noticeList2",
					title: "公告列表",
					content: "noticeList2"
				})
				this.$parent.$parent.$parent.editableTabsValue = "noticeList2"
			}
		},

		//更多流程中心
		showMoreFlow () {
			var editableTabs = this.$parent.$parent.$parent.editableTabs;
			var flag = false;
			if (editableTabs.length > 0) {
				for (var i in editableTabs) {
					if (editableTabs[i].content == "flowList") {
						flag = true;
						break;
					}
				}
				if (flag) {
					this.$parent.$parent.$parent.editableTabsValue = "flowList"
				}
				else {
					this.$parent.$parent.$parent.editableTabs.push({
						name: "flowList",
						title: "流程列表",
						content: "flowList"
					})
					this.$parent.$parent.$parent.editableTabsValue = "flowList"
				}
			} else {
				this.$parent.$parent.$parent.editableTabs.push({
					name: "flowList",
					title: "流程列表",
					content: "flowList"
				})
				this.$parent.$parent.$parent.editableTabsValue = "flowList"
			}
		},

		//获取流程信息接口
		getNoFinishFlowInfo () {
			var that = this;
			this.flowloading = true;

			let obj = {
				state: 0,//是否已办--0未办,1已办
				receiverId: constant.userId,
				currentPage: 1,
				pageSize: 10
			}

			_Api.getBusinessList(obj).then(function (response) {
				var data = response.data;
				if (data.code == "1") {
					that.totalFlow.unread = data.total > 99 ? '99+' : data.total
					if (data.total > 0) {
						that.noFinishflowDetails = data.rows.splice(0);
						item.flagUI = 'flowInfo';
						that.flowloading = false;
					} else {
						that.noFinishflowDetails = [];
						that.flowloading = false;
					}
				}
			}).catch(() => {
				that.flowloading = false;
			})
		},

		getFinishedFlowInfo () {
			var that = this;
			this.flowloading = true;

			let obj = {
				state: 1,//是否已办--0未办,1已办
				receiverId: constant.userId,
				currentPage: 1,
				pageSize: 10
			}

			_Api.getBusinessList(obj).then(function (response) {
				var data = response.data;
				if (data.code == "1") {
					that.totalFlow.read = data.total > 99 ? '99+' : data.total
					if (data.total > 0) {
						that.flowDetails = data.rows.splice(0);
						that.flowDetails.forEach(item => {
							item.flagUI = 'flowInfo';
						})
						that.flowloading = false;
					} else {
						that.flowDetails = [];
						that.flowloading = false;
					}
				}
			}).catch(() => {
				that.flowloading = false;
			})
		},

		getListById (orderId, orderNo) {
			var that = this;
			this.isPurOrdShow = true;
			this.isAccountShow = true;
			this.isPurOrdShow = true;
			let obj = {
				id: orderId
			}
			this.detailsLoading = true
			if (orderNo.indexOf('SW') != -1) {
				_Api.getGoodsAccountBillById(obj).then(function (response) {
					that.detailsLoading = false
					var data = response.data;
					if (data.code == "1") {
						if (data.total > 0) {
							that.setClickValue = data.rows
							that.noticeShow = false;
							that.flowShow = false;
							that.isAccountAudit = true;
							that.isPhysicalShow = false;
							that.isAccountShow = true;
							that.isPurOrdShow = true;
						} else {
							Msg.showErrorMsg(data.info)
						}
					}
				}).catch((err) => {
					that.detailsLoading = false
					Msg.showErrorMsg(err.data.message)
				})
			} else if (orderNo.indexOf('KJ') != -1) {
				_Api.getAccountBillById(obj).then(function (response) {
					that.detailsLoading = false
					var data = response.data;
					if (data.code == "1") {
						if (data.total > 0) {
							const { billState } = data.rows
							that.setClickValue = data.rows
							that.noticeShow = false;
							that.flowShow = false;
							that.isPhysicalShow = true;
							that.isPurOrdShow = true;
							if (that.$global.user.userTypeId == 1) {
								if (billState > 2) {
									that.isAccountShow = true;
									that.isAccountAudit = false
								} else {
									that.isAccountShow = false;
									that.isAccountAudit = true
								}
							} else {
								that.isAccountShow = false;
								that.isAccountAudit = true
							}
						} else {
							Msg.showErrorMsg(data.info)
						}
					}
				}).catch((err) => {
					that.detailsLoading = false
					Msg.showErrorMsg(err.data.message)
				})
			} else {
				_Api.getPurchaseOrderBillById(obj).then(function (response) {
					that.detailsLoading = false
					var data = response.data;
					if (data.code == "1") {
						if (data.total > 0) {
							if (data.rows.delFlag == 1) {
								Msg.showPopMsg('订单已被退回或被强制收回，暂不能做后续操作！')
								that.noticeShow = true;
								that.flowShow = true;
								return
							}
							that.setClickValue = data.rows
							that.noticeShow = false;
							that.flowShow = false;
							that.isAccountAudit = true;
							that.isPhysicalShow = true;
							that.isAccountShow = true;
							that.isPurOrdShow = false;
							if (constant.accountType == "1") {
								if (data.rows.billState == 1) {
									that.ordStatus = 4
								} else {
									that.ordStatus = 1
								}
							} else if (constant.accountType == "4") {
								if (data.rows.billState == 1) {
									that.ordStatus = 4
								} else if (data.rows.billState == 2) {
									that.ordStatus = 3
								}
							}
						}
					} else {
						Msg.showErrorMsg(data.info)
					}
				}).catch((err) => {
					that.detailsLoading = false
					Msg.showErrorMsg(err.data.message)
				})
			}
		},

		//更新流程状态
		updateFlowState (id) {
			let obj = {
				data: id
			}

			_Api.updateBusinessState(obj).then(function (response) {
				var data = response.data;
				if (data.code == "1") {
					console.log("更新流程状态成功！");
				} else {
					Msg.showErrorMsg(data.info)
				}
			}).catch((err) => {
				Msg.showErrorMsg(err.data.message)
			})
		},

		handleClick () {
			if (this.bActiveName == "noFinishFlow") {
				this.getNoFinishFlowInfo();
			} else if (this.bActiveName == "FinishFlow") {
				this.getFinishedFlowInfo();
			}
		},
		// 刷新流程数据
		refreshFlowList () {
			this.getNoFinishFlowInfo();
			this.getFinishedFlowInfo();
		}
	},
	mounted () {
		this.initData();
		//获取流程信息
		this.getNoFinishFlowInfo();
		this.getFinishedFlowInfo();
	},
	components: {
		noticeDetailsComponent,
		physicalApplyComponents,
		accountApplyComponents,
		purOrderDetailsComponents,
		accountAuditComponents
	}
};
</script>

